<template>
    <!-- pages/join/join.wxml -->
    <view class="container">
        <view class="form" v-if="!success">
            <van-cell-group>
                <van-cell title="所属城市" is-link>
                    <region-picker level="city" @change="bindRegionChange" :value="region">
                        <view :class="region ? 'picker' : ''">{{ region ? region : '请选择意向开店城市' }}</view>
                    </region-picker>
                </van-cell>
            </van-cell-group>
            <van-cell-group>
                <van-field label="您的姓名" v-model="name" placeholder="请填写您的姓名" maxlength="5" />
            </van-cell-group>
            <van-cell-group>
                <van-field label="您的电话" v-model="phone" placeholder="请填写您的电话" maxlength="11" />
            </van-cell-group>
            <van-cell-group>
                <van-field label="留言建议" v-model="message" placeholder="选填" />
            </van-cell-group>
            <view class="note">一个电话解决您的开店疑惑：{{ tele }}</view>
        </view>
        <!-- 提交成功 -->
        <view class="success" v-if="success">
            <icon type="success" size="150rpx"></icon>
            <view class="text">提交成功</view>
            <view class="info">您的申请已提交，请等待官方人员与您联系!您也可以主动拨打{{ tele }}咨询!</view>
        </view>
        <view class="btns">
            <button hover-class="button-click" class="btn tel border-primary color-primary" @tap="call">电话咨询</button>
            <button hover-class="button-click" v-if="!success" class="btn submit bg-primary" @tap="submit">提交申请</button>
        </view>
    </view>
</template>

<script>
// pages/join/join.js
var http = require('../../utils/http');
var util1 = require('../../utils/util.js');
const app = getApp();
export default {
    data() {
        return {
            region: '',
            success: false,
            name: '',
            phone: '',
            message: '',
            tele: '' //加盟电话
        };
    }
    /**
     * 生命周期函数--监听页面加载
     */,
    onLoad(options) {},
    /**
     * 生命周期函数--监听页面初次渲染完成
     */
    onReady() {},
    /**
     * 生命周期函数--监听页面显示
     */
    onShow() {
        this.getInfo();
    },
    /**
     * 生命周期函数--监听页面隐藏
     */
    onHide() {},
    /**
     * 生命周期函数--监听页面卸载
     */
    onUnload() {},
    /**
     * 页面相关事件处理函数--监听用户下拉动作
     */
    onPullDownRefresh() {},
    /**
     * 页面上拉触底事件的处理函数
     */
    onReachBottom() {},
    /**
     * 用户点击右上角分享
     */
    onShareAppMessage() {},
    methods: {
        selectCity() {},

        onChange(event) {
            const { picker, value, index } = event.detail;
            picker.setColumnValues(1, citys[value[0]]);
        },

        bindRegionChange: function (e) {
            //console.log('picker发送选择改变，携带值为', e.detail.value)
            this.setData({
                region: e.detail.value
            });
        },

        submit: function () {
            var that = this;
            if (that.phone == '' || that.name == '' || that.region.length == 0) {
                uni.showToast({
                    title: '请填写完整'
                });
                return;
            }
            if (!util1.checkPhone(that.phone)) {
                uni.showToast({
                    title: '请填写正确的手机号',
                    icon: 'none'
                });
                return;
            }
            if (app.globalData.isLogin) {
                http.request(
                    '/member/user/saveFranchiseInfo',
                    '1',
                    'post',
                    {
                        city: that.region[1],
                        contactName: that.name,
                        contactPhone: that.phone,
                        message: that.message
                    },
                    app.globalData.userDatatoken.accessToken,
                    '',
                    function success(info) {
                        console.info('加盟信息===');
                        console.info(info);
                        if (info.code == 0) {
                            that.setData({
                                success: info.data
                            });
                        }
                    },
                    function fail(info) {}
                );
            } else {
                //console.log('未登录失败！')
            }
        },

        getInfo: function () {
            var that = this;
            if (app.globalData.isLogin) {
                http.request(
                    '/member/user/getFranchiseInfo',
                    '1',
                    'get',
                    {},
                    app.globalData.userDatatoken.accessToken,
                    '',
                    function success(info) {
                        console.info('加盟信息===');
                        console.info(info);
                        if (info.code == 0) {
                            that.setData({
                                tele: info.data.franchise,
                                success: info.data.isCommit
                            });
                        }
                    },
                    function fail(info) {}
                );
            } else {
                //console.log('未登录失败！')
            }
        },

        call: function () {
            let that = this;
            //console.log("拨打电话+++")
            uni.makePhoneCall({
                phoneNumber: that.tele,
                success: function () {
                    //console.log("拨打电话成功！")
                },
                fail: function () {
                    //console.log("拨打电话失败！")
                }
            });
        }
    }
};
</script>
<style>
@import './join.css';
</style>
